<template>
  <div class="groupCard" @click="topage(pageList[0].id)">
    <div class="groupCard_header">
      <text class="groupCard_header_title">团购活动</text>
      <div class="groupCard_header_right"  @click="topage(pageList[0].id)">
        <text class="groupCard_header_right_title">查看更多</text>
        <text class="groupCard_header_right_icon">&#xe61f;</text>
      </div>
    </div>

       <scroller class="groupCard_content" scroll-direction='horizontal'>
         <div class="groupCard_item" v-for="(item,index) in products" @click="gogroupclick(item)">
           <image class="groupCard_item_img" :src="item.itemList[0].thumbnail"></image>
           <text class="groupCard_item_text">￥{{item.price}}</text>
         </div>

      </scroller>
      <!-- <image class="groupCardimg" src="http://rzico-weex.oss-cn-hangzhou.aliyuncs.com/10200/upload/20210903/%E5%BE%AE%E4%BF%A1%E5%9B%BE%E7%89%87_20210906174141.png"></image> -->
  </div>
</template>

<script>
import  {list} from '@/api/groupBuy'
import		{list as wxPageList} from '@/api/wxPage'
export default {
  name: "groupCard",
  data(){
    return{
      tagIds:[],
      products:[{itemList:[{thumbnail:""}]}],
      pageList:[]
    }
  },
  props: ['content'],
  created() {
    	this.loadPage()
    this.initIconFont()
    this.loadProduct()
    console.info('222222222222222222222222222222222222222222222222222')
    console.info(this.content)
  },
  methods:{
    gogroupclick(data){
      console.info('44444444444')
      console.info(data)

      var obj={
        productId:data.itemList[0].productId,
        groupId:data.id,
        productType:'group',
        priceBox:data.price
      }
      eeui.openPage({
        params:obj,
        url: 'root://pages/goods/product/groupBuydetails.js',
        statusBarType: 'immersion',
        statusBarStyle:false,
      })
    },
    	topage(e) {
				eeui.openPage({
					url: 'root://pages/index/wxPage/wxPage.js',
					params: e,
					statusBarType: 'immersion',
					statusBarStyle:false
				})
			},
    		loadPage() {
				if (this.content.tagids != null) {
					this.tagIds = this.content.tagids.split(',');
					for (var i = 0; i < this.tagIds.length; i++) {
						this.tagIds[i] = parseInt(this.tagIds[i])
					}
				}
				wxPageList({
					mchId: this.getGlobalData().mchId,
					tagIds: this.tagIds
				}).then(res => {
					this.pageList = res.data.data
				})
			},
    gogroucard(){
           eeui.openPage({
                  url: 'root://pages/member/groupbuy/index.js',
                  statusBarType: 'immersion',
                  statusBarStyle:false,
              })
    },
    gotobuy(data,item){
      var obj={
        productId:data.productId,
        groupId:item.id,
        productType:'group',
        priceBox:this.products[0].price
      }
      eeui.openPage({
        params:obj,
        url: 'root://pages/goods/product/groupBuydetails.js',
        statusBarType: 'immersion',
        statusBarStyle:false,
      })
    },
    loadProduct(){
      var _this = this
      list({mchId:'10200',type:2}).then(res=>{
        if (res.data.data.length == 0){
          return;
        }
        res.data.data.forEach(item=>{
          if (_this.isNull(item.logo)){
            item.logo='http://cdnx.rzico.com/images/pcLogo.png'
          }
          if (_this.isNull(item.name)){
            item.name='例如：厦门睿商团购'
          }
          if (_this.isNull(item.point)){
            item.point=300
          }
          if (item.itemList.length > 0){
            item.itemList.forEach(function (items){
              items.thumbnail = _this.thumbnail(item.thumbnail,196,196)
            })
          }
        })
         console.info('2999999999999999999999999999999999999')
        console.info(res.data.data)
        this.products=res.data.data
      })
    }
  }
}
</script>

<style scoped>
.groupCardimg{
  width: 700px;
  height: 200px;
}
.groupCard{
  width: 710px;
  padding-top: 20px;
  padding-bottom: 20px;
  padding-left: 20px;
  padding-right: 20px;
  box-sizing: border-box;
  background-color: white;
  margin-top: 20px;
  margin-left: 20px;
  border-radius: 12px;
}
.groupCard_header{
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: center;
  padding: 10px 0px;
}

.groupCard_header_title{
  font-size: 36px;
  font-weight: 500;
}
.groupCard_header_right{
  display: flex;
  flex-direction: row;
  align-items: center;
}

.groupCard_header_right_title{
  font-size: 28px;
  font-weight: 400;
  color: rgba(26, 26, 30, 0.3);
}

.groupCard_header_right_icon{
  font-size: 24px;
  font-weight: 400;
  color: rgba(26, 26, 30, 0.3);
  margin-left: 4px;
  font-family: iconfont2;
  margin-bottom: 5px;
}

.groupCard_item{
  display: flex;
  flex-direction: column;
  flex-grow: 1;
  margin: 20px 10px 0px 9px;
}

.groupCard_item_img{
  width: 196px;
  height: 196px;
  border-radius: 16px;
}

.groupCard_content{
  width: 670px;
  display: flex;
  flex-direction: row;
  /* overflow-x: auto; */

}
.groupCard_item_text{
  font-size:32px;
  font-weight: bold;
  color:red;
  margin-top:20px;
  text-align:center;
  /*lines:1;*/
  /*text-overflow: ellipsis;*/
}
</style>
